<!--

    Copyright (c) 2010-2025 Eclipse Dirigible contributors

    All rights reserved. This program and the accompanying materials
    are made available under the terms of the Eclipse Public License v2.0
    which accompanies this distribution, and is available at
    http://www.eclipse.org/legal/epl-v20.html

    SPDX-FileCopyrightText: Eclipse Dirigible contributors
    SPDX-License-Identifier: EPL-2.0

-->
<!DOCTYPE HTML>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" ng-app="ide-tracing-variables" ng-controller="IDETracingVariablesViewController">

    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="icon" sizes="any" href="data:;base64,iVBORw0KGgo=">
        <title config-title></title>
        <script type="text/javascript" src="/services/web/perspective-tracing/configs/tracing-variables-view.js"></script>
        <script type="text/javascript" src="/services/js/platform-core/services/loader.js?id=view-js"></script>
        <link type="text/css" rel="stylesheet" href="/services/js/platform-core/services/loader.js?id=view-css" />
        <script type="text/javascript" src="/services/web/perspective-tracing/views/js/tracing-variables.js"></script>
    </head>

    <body class="bk-vbox">
        <bk-fieldset class="fd-margin--sm">
            <bk-form-group name="viewForm">
                <bk-form-item horizontal="true">
                    <bk-form-label for="type" colon="true" style="width: 4.125rem">Type</bk-form-label>
                    <bk-input id="type" name="type" ng-model="selectedTask.type" type="text" readonly></bk-input>
                    <bk-form-label for="status" colon="true" style="min-width: 3.625rem;margin-left: 0.5rem">Status</bk-form-label>
                    <bk-input id="status" name="status" ng-model="selectedTask.status" type="text" readonly></bk-input>
                </bk-form-item>
                <bk-form-item horizontal="true">
                    <bk-form-label for="execution" colon="true" style="width: 4.125rem">Execution</bk-form-label>
                    <bk-input id="execution" name="execution" ng-model="selectedTask.execution" type="text" readonly></bk-input>
                    <bk-form-label for="step" colon="true" style="min-width: 3.625rem;margin-left: 0.5rem">Step</bk-form-label>
                    <bk-input id="step" name="step" ng-model="selectedTask.step" type="text" readonly></bk-input>
                </bk-form-item>
                <bk-form-item horizontal="true">
                    <bk-form-label for="definition" colon="true" style="width: 4.125rem">Definition</bk-form-label>
                    <bk-input id="definition" name="definition" ng-model="selectedTask.definition" type="text" readonly></bk-input>
                    <bk-form-label for="instance" colon="true" style="min-width: 3.625rem;margin-left: 0.5rem">Instance</bk-form-label>
                    <bk-input id="instance" name="instance" ng-model="selectedTask.instance" type="text" readonly></bk-input>
                </bk-form-item>
                <bk-form-item horizontal="true">
                    <bk-form-label for="tenant" colon="true" style="width: 4.125rem">Tenant</bk-form-label>
                    <bk-input id="tenant" name="tenant" ng-model="selectedTask.tenant" type="text" readonly></bk-input>
                    <bk-form-label for="thread" colon="true" style="min-width: 3.625rem;margin-left: 0.5rem">Thread</bk-form-label>
                    <bk-input id="thread" name="thread" ng-model="selectedTask.thread" type="text" readonly></bk-input>
                </bk-form-item>
                <bk-form-item horizontal="true">
                    <bk-form-label for="started" colon="true" style="width: 4.125rem">Started</bk-form-label>
                    <bk-input id="started" name="started" ng-model="selectedTask.started" type="text" readonly></bk-input>
                    <bk-form-label for="ended" colon="true" style="min-width: 3.625rem;margin-left: 0.5rem">Ended</bk-form-label>
                    <bk-input id="ended" name="ended" ng-model="selectedTask.ended" type="text" readonly></bk-input>
                </bk-form-item>
                <bk-form-item horizontal="false">
                    <bk-form-label for="error" colon="true">Error</bk-form-label>
                    <bk-textarea id="error" name="error" ng-model="selectedTask.error" cols=20 readonly></bk-textarea>
                </bk-form-item>
                <bk-form-item horizontal="false">
                    <bk-form-label for="diff" colon="true">Changes</bk-form-label>
                    <bk-textarea id="diff" name="diff" ng-model="selectedTask.diff" cols=20 readonly></bk-textarea>
                </bk-form-item>
            </bk-form-group>
        </bk-fieldset>
        <!-- <bk-toolbar class="bk-border--top" compact="true">
            <bk-toolbar-spacer></bk-toolbar-spacer>
            <bk-button state="transparent" glyph="sap-icon--refresh" title="Refresh" aria-label="Refresh" ng-click="reload()"></bk-button>
            <bk-toolbar-separator></bk-toolbar-separator>
            <bk-button state="transparent" toggled="displaySearch" glyph="sap-icon--search" title="Toggle search" aria-label="Toggle search" ng-click="toggleSearch()"></bk-button>
        </bk-toolbar>
        <bk-toolbar ng-if="displaySearch">
            <bk-input type="search" placeholder="Search by name" ng-keyup="inputSearchKeyUp($event)" ng-model="searchText" bk-focus="true"></bk-input>
        </bk-toolbar> -->
        <bk-scrollbar class="bk-fill-parent">
            <table bk-table outer-borders="horizontal" display-mode="compact">
                <thead bk-table-header sticky="true">
                    <tr bk-table-row>
                        <th bk-table-header-cell interactive="false">Name</th>
                        <th bk-table-header-cell interactive="false">Input</th>
                        <th bk-table-header-cell interactive="false">Output</th>
                    </tr>
                </thead>
                <tbody bk-table-body>
                    <tr bk-table-row ng-repeat="next in variablesList track by next.name" hoverable="false" activable="false">
                        <td bk-table-cell>{{next.name}}</td>
                        <td bk-table-cell>{{next.input}}</td>
                        <td bk-table-cell>{{next.output}}</td>
                    </tr>
                    <tr ng-if="variablesList.length === 0" bk-table-row>
                        <td bk-table-cell no-data="true">{{getNoDataMessage()}}</td>
                    </tr>
                </tbody>
            </table>
        </bk-scrollbar>
        <bk-pagination ng-if="totalRows > 0" current-page="currentPage" total-items="totalRows" items-per-page="pageSize" items-per-page-options="[10, 20, 50, 100]" items-per-page-placement="top-start" display-total-items="true"
            compact="true" page-change="onPageChange(pageNumber)" items-per-page-change="onItemsPerPageChange(itemsPerPage)">
        </bk-pagination>
        <theme></theme>
    </body>

</html>
